<template>
	<view class="uiwu">
		<uiwu-list :loading="more">
			<view class="uiwu-list">
				<view class="uiwu-list-item" v-for="(item,index) in listData" :key="index">
					<view>
						<view class="top">订单编号：{{item.order_id}}</view>
						<view class="in uiwu-flex">
							<view class="money">
								充值金额：<text>￥{{item.price}}</text>
							</view>
							<view class="shouyi">
								收益：<text>￥{{item.number}}</text>
							</view>
							<view class="time">
								充值时间：{{item.add_time}}
							</view>
						</view>
					</view>
					<view></view>
				</view>
			</view>
		</uiwu-list>
	</view>
</template>

<script setup lang="ts">
	import { onLoad , onReachBottom } from '@dcloudio/uni-app';
	import { inject, ref } from 'vue';
	import { brokeragelist } from '../../api/api';
	import { uiwu } from '../../config/config';
	const listData = ref<Array<object>>([])
	const pageNum = ref<number>(1)
	const more = ref<string>('loading');
	const isLock = ref<boolean>(true)
	const getbrokeragelist = async (mack:boolean=false) => {
		if(!mack) pageNum.value = 1
		const { data:{data , total}} = await brokeragelist({
			page:pageNum.value,
		});
		isLock.value = true
		uiwu.setlist({
			isMore:mack,
			listData,
			total,
			listRow:data,
			more,
			pageNum
		})
		
	}
	onReachBottom(()=>{
		if(!isLock.value) return
		isLock.value = false
		pageNum.value++
		getbrokeragelist(true)
	})
	onLoad(()=>{
		getbrokeragelist()
	})
</script>

<style lang="scss">
	page{
		background-color: #e6e6e6;
	}
	.uiwu-list{
		width: 100%;
		padding-top: 20rpx;
		&-item{
			position: relative;
			height: 246rpx;
			width: 100%;
			padding: 0 18rpx;
			margin-bottom: 32rpx;
			.top{
				font-size: 28rpx;
				font-weight: 400;
				color: #444444;
				padding: 24rpx 0;
				border-bottom: 1rpx solid #e6e6e6;
			}
			.in{
				padding: 24rpx 0;
				flex-wrap: wrap;
				justify-content: space-between;
				.money{
					font-size: 28rpx;
					color: #444444;
					text{
						color: #231815;
						font-weight: bold;
					}
				}
				.shouyi{
					font-size: 28rpx;
					color: #444444;
					text{
						color: #EF821E;
						font-weight: bold;
					}
				}
				.time{
					font-size: 28rpx;
					font-weight: 400;
					color: #999999;
					margin-top: 14rpx;
				}
			}
			>view{
				position: absolute;
				width: 702rpx;
				height: 246rpx;
				background-color: #fff;
				border:3rpx solid #231815;
				border-radius: 24rpx;
				z-index: 9;
				padding: 0 24rpx;
				&:nth-child(2){
					z-index: 8;
					width: 714rpx;
					background-color: #FAC500;
					top: 12rpx;
				}
			}
		}
	}
</style>
